<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>

<script type="text/javascript">
	$(document).ready(function(){
		//layout_role();
		var container = $('div.container');
		// validate the form when it is submitted
		var validator = $("#form1").validate({
			submitHandler: function(form) {
				if($(".window-shadow").css("display") == undefined){
					
						var nodes = treeObject.getNodesByParam('changed',true);
						$(nodes).each(function(i){
							$('form').append("<input  type=hidden name=\"role.features["+i+"].id\" value='"+$(nodes).get(i).id+"'/>");
							$('form').append("<input  type=hidden name=\"role.features["+i+"].checked\" value='"+$(nodes).get(i).checked+"'/>");
							if($(nodes).get(i).isParent) {
								var subNodes = treeObject.getSubNodesByParam('changed',true,$(nodes).get(i));
								if(!subNodes || subNodes.length==0) {
									$('form').append("<input  type=hidden name=\"role.features["+i+"].allCheck\" value='true'/>");
								}
							}
						});
						form.submit();
				}else{
					var nodes = treeObject.getNodesByParam('changed',true);
					$(nodes).each(function(i){
						$('form').append("<input  type=hidden name=\"role.features["+i+"].id\" value='"+$(nodes).get(i).id+"'/>");
						$('form').append("<input  type=hidden name=\"role.features["+i+"].checked\" value='"+$(nodes).get(i).checked+"'/>");
						if($(nodes).get(i).isParent) {
							var subNodes = treeObject.getSubNodesByParam('changed',true,$(nodes).get(i));
							if(!subNodes || subNodes.length==0) {
								$('form').append("<input  type=hidden name=\"role.features["+i+"].allCheck\" value='true'/>");
							}
						}
					}); 
					form.submit();
				}
			},
			errorContainer: container,
			errorLabelContainer: $("ol", container),
			wrapper: 'li',
			meta: "validate",
			rules: {
			     "role.roleName":{
			      required: true, 
			      maxlength:100 , 
			      remote: {
				      	url: '<s:url value="/role/check"/>',
				      	type: 'post',
				      	data: {
				      		id : function() {
				      			return $('#roleId').val();
				      		}
				      	}
				  }
			     },
			     "role.desc":{
				      maxlength:2000
			     	}
		    },
		    messages:{
		    	"role.roleName":{
		    		required: "角色名称是必需的",
		    		maxlength:"角色名称最大不能超过100字符" , 
		    		remote: jQuery.format("角色名称不能重复！")
		    	},
		    	"role.desc":{
				      maxlength:"不能超过2000字符"
			     	}
		    }
			
		});
		
		
		$("#btnReturn").click(function(){			
		 var formStr = $('#form1').serialize();		 
		 if(formStr==jQuery.data(document.body, 'from'))
		 {
		    backtoList();
		 }
		 else
		 {		
				jConfirm('确定要执行取消操作吗？', '确认对话框 ', function(r) {
					if(r){
					
                    	backtoList();
                        return false;
                    }
	  			});
				
		}	    
		  	});		
		jQuery.data(document.body, 'from', $('#form1').serialize());  
		
		$("#privilegeList").inputStyle({
			operatorType:"text",
			operatorText:"选择",
			controllerWidth:200,
			operatorFun:popde
		});
		
	});
	
	function backtoList()
	{
	  window.location.href = '<s:url value="/role/main"/>';
	}
	
	function popde(){
		new DDWin({
			el:'privilegeTreePanel'
			,dep:'divAround_privilegeList'
			,clickBody:'save'
		})
	}
	function clearDepartment(){
		$("#privilegeList").val('');
	}
	</script>
<div class="tempDiv" style="position:absolute;overflow:hidden;width:100%;height:100%;top:-1px">
<!--jquery validator显示错误信息的容器 -->
			    <div class="serverErrorContainer" style="position:relative;">
			        <div class="serverError">
			        <ol>

			        </ol>
			        </div>
			    
			        <div class="container">
			            <div class="searchButtonBox handleDiv" onclick="displayTable('handleDiv')">
			            	<a href='javascript:void(0);' class="button switchOpen"  tabindex="-1" >
			    			<div style="border:1px solid #96d0d2;border-bottom:0px;position:relative;float:right;cursor:pointer;">
			    			<img id="handleDiv" src="../theme/default/images/main/search/search_switch_open_normal.png" style="position:absolute;top:6px">
			    			<input type="button" style="margin-top:0px;width:16px;">
			    			</div>
			    			</a>
			            </div>
			            <div id="handleDiv_child" class="errorDIv" divAttend="attend">
			                <ol>
			                </ol>
			            </div>
			        </div>
			    </div>
			    <!-- end -->	
<s:form id="form1" theme="simple" action="/role/save">	
<div class="content_c" style="overflow-y:auto;overflow-x:hidden;position:relative;">
    			
				<s:hidden name="role.roleId" id="roleId"></s:hidden>
				<table cellspacing="0" cellpadding="0" width="100%" style="border:1px solid #c2e2eb;">
					<tr class="listviewHeader">
						<td colspan="2">
							角色信息
						</td>
					</tr>
				</table>
				<table width="100%" cellspacing="0" cellpadding="0" style="padding:12px;">
				<tbody><tr><td>
				<table cellspacing="0" cellpadding="0" width="100%" class="listviewTable">
					<tr>
						<td class="listviewTD" style="width:150px" align="right">
							权限清单:
                        </td>
						<td class="listviewContent">
							<input type="text" readonly="readonly" id="privilegeList" value="单击此处查看明细" class="textTest">
						</td>
					</tr>
					<tr>
						<td class="listviewTD" style="width:150px" align="right">
							<font color="red">*</font>&nbsp;<s:text name="roleName"/>
						</td>
						<td class="listviewContent">
							<s:textfield name="role.roleName" maxlength="100" cssClass="text" cssStyle="width:198px"></s:textfield>
						</td>
					</tr>
					<tr>
						<td class="listviewTD" align="right">
							<s:text name="roleDescription"/>
						</td>
						<td colspan="2" class="listviewContent">
							<s:textarea name="role.desc" cssStyle="width:300px;height:80px; " cssClass="textarea"></s:textarea>
						</td>
					</tr>
				</table>
				</td></tr></table>
</div>
	<div class="content_s layout_div" style="height:46px;bottom:0px;width:100%;position:absolute;">
		<div class="buttonBox" style="margin-top:10px">
			<a href="#" class="button" tabindex="-1"><input id="btnSubmit" type="submit" value="<s:text name="save"/>"></a>
			<a href="#" class="button" tabindex="-1"><input id="btnReturn" type="button" value="返回"></a>
		</div>
	</div>
</s:form>
</div>
<div id="privilegeTreePanel" class="dropDD_contentDiv">
	<div style="overflow:auto;height:266px">
		<ul id="featureTree" class="tree"></ul>	
	</div>
	<div class="buttonBox" style="position:absolute;bottom:0px;background:#f3f4f4;height:30px;padding-top:4px">
		<a href="javascript:void(0);" class="button" tabindex="-1"><input type="button" onclick="window.curDDWin.saveWin();return false;" value="确认"></a>
	</div>
</div>
<SCRIPT LANGUAGE="JavaScript">
	var treeObject;
	var values = '';
	<s:iterator value="role.features">
		values += '<s:property value="id"/>,';
	</s:iterator>
	$(document).ready(
			function() {
				var setting = {
					asyncUrl : "<s:url value='/feature/tree'/>?allLevel=false&role.roleId="+$('#roleId').val(), //获取节点数据的URL地址
					asyncParam : ["id"],
					checkable: true,
					checkType: {
						"Y": "s",
						"N": "s"
					},
					callback : {
						click : function(event, treeId, treeNode) {
							
						},// 点击每个节点的事件:
						loadTreeSuccess : function(zTree, msg) {					
							treeObject=zTree;
							zTree.expandAll();
							preSelectNode(zTree,zTree.setting.root['nodes']);
						},
						asyncSuccess: function (event, treeId, treeNode, msg) {	
							if(treeNode!=null){			  
						 		if(treeNode.nodes && treeNode.nodes.length>0) {
									preSelectNode(treeObject,treeNode.nodes);
								}
						 		expandNode(treeNode);
						   }					
						},
						change : function(event, treeId, treeNode){
							changeNode(treeNode);
						}
					}
				};
			
				$("#featureTree").zTree(setting);
				contentLayout();
			});
	function changeNode(treeNode) {
		$.extend(treeNode,{changed:true});
		if(treeNode.parentNode) {
			changeParentNode(treeNode.parentNode);
		}
		if(treeNode['nodes'] && treeNode['nodes'].length>0) {
			changeChildNodes(treeNode['nodes']);
		}
	}

	function expandNode(treeNode) {
		if(treeNode.changed && treeNode['checked']) {
			if(treeNode['nodes'] && treeNode['nodes'].length>0) {
				for(var i=0;i<treeNode['nodes'].length;i++) {
					var childNode = treeNode['nodes'][i];
					childNode['checked'] = true;
					$.extend(childNode,{changed:true});
					treeObject.updateNode(childNode,false);
					expandNode(childNode);
				}
			}
		}
	}

	function changeParentNode(treeNode) {
		$.extend(treeNode,{changed:true});
		if(treeNode.parentNode) {
			changeParentNode(treeNode.parentNode);
		}
	}
	function changeChildNodes(nodes) {
		for(var i=0;i<nodes.length;i++) {
			var treeNode = nodes[i];
			$.extend(treeNode,{changed:true});
			if(treeNode['nodes'] && treeNode['nodes'].length>0) {
				changeChildNodes(treeNode['nodes']);
			}
		}
	}
	
	function preSelectNode(zTree,nodes) {
		var ids = values.split(",");
		for(var i=0;i<nodes.length;i++) {
			if(nodes[i]){
				var exists = false;
	  			for(var j=0;j<ids.length;j++) {
	  				if(nodes[i].id==ids[j]) {
	  					exists = true;
	  				}
	  			}
	  			if(exists) {
					nodes[i].checked=true;
				}
				else {
					nodes[i].checked=false;
				}
				zTree.updateNode(nodes[i],true);
				if(exists && nodes[i].halfChecked) {
					var checkObj = $("#" + nodes[i].tId + "_check");
					checkObj.removeClass();
					checkObj.addClass("chk checkbox_true_part first_show");
				}
				if(nodes[i]['nodes'] && nodes[i]['nodes'].length>0) {
		  			preSelectNode(zTree,nodes[i]['nodes']);
		  		}
			}
		}
	}
	
function contentLayout(){
	$(".tempDiv").css("height",window.document.body.clientHeight-34-28);
	$(".content_c").css("height",window.document.body.clientHeight-$(".serverErrorContainer").height()-46-34-28);
	if($.browser.msie&&($.browser.version == "6.0")){
		$(".content_c").css("width",window.document.body.clientWidth-5);
	}
	$(".serverErrorContainer").css("width",window.document.body.clientWidth);
}

$(window).resize(function(){
	$(".tempDiv").css("height",window.document.body.clientHeight-34-28);
	$(".content_c").css("height",window.document.body.clientHeight-$(".serverErrorContainer").height()-46-34-28);
	if($.browser.msie&&($.browser.version == "6.0")){
		$(".content_c").css("width",window.document.body.clientWidth-5);
	}
	$(".serverErrorContainer").css("width",window.document.body.clientWidth);
});	
</script>